<template>
    <div class="manage_content">
        <div class="search">
            <el-form :inline="true" class="demo-form-inline">
                <el-form-item label="捐助项目名称：">
                    <el-input v-model="searchData.name" placeholder="捐助项目名称"></el-input>
                </el-form-item>
                <el-form-item label="捐助项目是否结束：">
                    <el-select v-model="searchData.status" placeholder="捐助项目是否结束">
                        <el-option label="进行中" value="1"></el-option>
                        <el-option label="已结束" value="0"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="项目目标金额 （起）：">
                    <el-input type='number' v-model="searchData.start_target_amount" placeholder="项目目标金额 （起）"></el-input>
                </el-form-item>
                <el-form-item label="项目目标金额 （止）：">
                    <el-input type='number' v-model="searchData.end_target_amount" placeholder="项目目标金额 （止）"></el-input>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="onSubmit">查询</el-button>
                </el-form-item>
            </el-form>
        </div>
        <div class="content_table">
            <el-button type="text" @click="add">新增</el-button>
            <el-button type="text" @click="del" :disabled="delVal.length<1">删除</el-button>
            <!-- 新增 编辑-->
            <el-dialog :title="formtitle" :visible.sync="dialogFormVisible">
                <el-form :rules="rules" ref="form" :model="form" :label-width="formLabelWidth">
                    <el-form-item label="项目名称" prop="pi_name">
                        <el-input v-model="form.pi_name" auto-complete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="详情" prop="pi_details">
                        <el-input type="textarea" v-model="form.pi_details" auto-complete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="项目捐赠目标金额" prop="pi_target_amount">
                        <el-input v-model="form.pi_target_amount" auto-complete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="项目介绍" prop="pi_intro">
                        <el-input type="textarea" v-model="form.pi_intro" auto-complete="off"></el-input>
                    </el-form-item>
                    <el-form-item label="热度排行" prop="pi_hot_sort">
                        <el-input v-model.number="form.pi_hot_sort" auto-complete="off" type="number"></el-input>
                    </el-form-item>
                    <el-form-item label="上架状态" prop="pi_is_up">
                        <el-select v-model="form.pi_is_up" placeholder="请选择上架状态">
                            <el-option label="下架" value="0"></el-option>
                            <el-option label="上架" value="1"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="项目状态" prop="pi_status">
                        <el-select v-model="form.pi_status" placeholder="请选择项目状态">
                            <el-option label="已结束" value="0"></el-option>
                            <el-option label="进行中" value="1"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="上传项目logo图">
                        <input ref="pic1" type="file">
                        <el-button type="text" @click="uploadImg(1)">上传图片</el-button>
                            <img :src="form.pi_video_url" alt="">
                            <el-button type="text" v-if="form.pi_video_url" style="color:red" @click="delImg(-1)">删除</el-button>
<<<<<<< HEAD
=======
                        <p class="el-form-item__error" v-if="!form.pi_video_url && img">请上传图片</p>
>>>>>>> b5e7354d9f7632bd015803079d8d3dd3a20f2b07
                    </el-form-item>
                    <el-form-item label="上传项目banner图">
                        <input ref="pic2" type="file">
                        <el-button type="text" @click="uploadImg(2)">上传图片</el-button>
                        <div  v-for="(item,index) in form.pi_banner" :key="item">
                            <img :src="item" alt="">
                            <el-button type="text" v-if="item" style="color:red"  @click="delImg(index)">删除</el-button>
                        </div>
<<<<<<< HEAD
=======
                         
                         <p class="el-form-item__error" v-if="form.pi_banner.length<1 && img">请上传图片</p> 
>>>>>>> b5e7354d9f7632bd015803079d8d3dd3a20f2b07
                    </el-form-item>
                    <el-form-item>
                        <el-button type="primary" @click="submit('form')">确定</el-button>
                        <el-button @click="cancel('form')">取消</el-button>
                    </el-form-item>
                </el-form>
            </el-dialog>
            <table-element :tableData='tableData' @msg='acquire'></table-element>
            <el-pagination v-if="tableData.data.length>0" :page-sizes="pageSizes" :page-size="page.page_limit" layout="sizes, prev, pager, next" :total="pageTotal" @size-change="handleSizeChange" @current-change='changePage'>
            </el-pagination>
        </div>
    </div>
</template>

<style scoped>
.manage_content {
    padding: 20px;
}

.el-pagination {
    padding: 20px;
}

content_table.el-pagination--small.el-pager li {
    /* font: 1em sans-serif; */
    font-size: 20px;
}

img {
    display: block;
<<<<<<< HEAD
    background: #ccc;
    max-width: 300px;
=======
    width: 300px;
>>>>>>> b5e7354d9f7632bd015803079d8d3dd3a20f2b07
}
</style>

<script src='../../directive/content/donateItem_manage.js'></script>


